<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="css/style.css" />
<title>LFDH</title>
<!-- styles needed by jScrollPane - include in your own sites -->
<link type="text/css" href="css/jquery.jscrollpane.css" rel="stylesheet" media="all" />
<style type="text/css" id="page-css">
	/* Styles specific to this particular page */
	.slide_imgContent
	{
		width: 20px;
		overflow: hidden;
        height: 100%;
	}

</style>

<!-- latest jQuery direct from google's CDN -->
<script type="text/javascript" src="script/jquery.min.js"></script>
<!-- the mousewheel plugin -->
<script type="text/javascript" src="script/jquery.mousewheel.js"></script>
<!-- the jScrollPane script -->
<script type="text/javascript" src="script/jquery.jscrollpane.min.js"></script>
<!-- the mwheelIntent script -->
<script type="text/javascript" src="script/mwheelIntent.js"></script>

<script type="text/javascript" id="sourcecode">
	$(function()
	{
		$('.slide_imgContent').jScrollPane({
		  horizontalDragMinWidth: 77,
		  horizontalDragMaxWidth: 77,
          
		});
        
	});
</script>

<!-- Anything Slider optional plugins, but needed so the embeded video controls will work in IE -->
<!-- http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js -->
<script src="script/swfobject.js"></script>
<link rel="stylesheet" href="css/anything_slider/anythingslider.css" />

<script src="script/jquery.anythingslider.js"></script>
<script src="script/jquery.anythingslider.video.js"></script>
<!-- script for slider-----------------
------------------------------------------>
<script>
	// DOM Ready
	// $(document).ready(function{
	   $(function(){
    		$('#slider').anythingSlider({
    			theme : "minimalist-round",
    		});
      });
     //});
</script>
<!-- link css for slide------------------------->
<link rel="stylesheet" href="css/anything_slider/theme-minimalist-round.css" />

</head>

<body>
	<div class="wrapper">
    	<div class="header">
            <div class="header_logo clear">
                <h1 class="logo"><img src="images/logo.png" alt="images" /></h1>
                <div class="text_header clear">
                    <p>Lorem ipsum dolor sit amet, consectetur adipicising elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<br /> 
                    Ut enim ad minium veniam, quis nostrud excersition ullam labor is nisi ut aliquip ex ea commodo consequat.</p>
                </div><!-- end of .text_header-->
            </div><!-- end of .header_logo-->
            <div class="header_menu">
            	<ul class="menu">
                	<li><a href="ref_print.html">Re'ferences et releastic</a></li>
                    <li><a href="expertises.html">Expertise</a></li>
                    <li><a href="identite.html">Identite et organisation</a></li>
                    <li><a href="lesprit.html">L'esprit LFDH</a></li>
                </ul> 
                           
            </div><!-- end of .header_menu-->
        </div><!-- end of .header -->
        <div class="mainContent">
        	<div class="slide_imgContent horizontal-only">
                <ul class="slideImg">
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home1.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb1.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home2.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb2.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home3.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb3.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home4.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb4.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home5.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb5.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home6.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb6.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home7.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb7.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li> 
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home8.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb8.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home9.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb9.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home10.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb10.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home11.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb11.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="fade-image">
                            <img class="fade-image-a" src="images/home_img/img_home12.jpg" alt="images" width="140px" height="100px"/>
							<img class="fade-image-b" src="images/home_img/timthumb12.jpg" alt="images" width="140px" height="100px"/>
                        </a>
                    </li> 
                </ul>
            </div>
            <div class="content">
                <div class="textContent clear">
                     <div class="empty_abowtextContent"></div>
                     <div class="above_textContent"><p>- Sulritre</p></div> 
                     <div class="below_textContent">
                        <h1>Lorem <br />ipsum dolor</h1>
                        <h2>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud ex ea consequat.</h2>
                        <h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor inci dolore magna aliqua ut enim ad minim.</h3>
                    </div>
                </div>
                <div class="videoContent">
                    <ul id="slider">
                		<!-- Vimeo: iframe -->
						
						<li class="panel1"><iframe width="840" height="530" src="http://local.lfdh/wp-content/uploads/2012/03/video01.flv" frameborder="0" allowfullscreen></iframe></li>
						
                        <li class="panel1"><iframe width="840" height="530" src="http://www.youtube.com/embed/AOjStDFHm5g" frameborder="0" allowfullscreen></iframe></li>
                        <!-- YouTube: iframe -->
		              <li class="panel3"><iframe width="840" height="530" src="http://www.youtube.com/embed/9IN5sjM1P3A" frameborder="0" allowfullscreen></iframe></li>
                        <!-- Vimeo: iframe -->
                        <li class="panel1"><iframe width="840" height="530" src="http://www.youtube.com/embed/ZKJWLPaBj9w" frameborder="0" allowfullscreen></iframe></iframe></li>
                        <!-- YouTube: iframe -->
                		<li class="panel3"><iframe width="840" height="530" src="http://www.youtube.com/embed/uHk02St8zYY" frameborder="0" allowfullscreen></iframe></li>
                        <!-- YouTube: Embedded -->
                		<li class="panel4"><object width="840" height="530"><param name="movie" value="http://www.youtube.com/v/zSgiXGELjbc&amp;hl=en_US&amp;fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/zSgiXGELjbc&amp;hl=en_US&amp;fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object></li>
                        <!-- HTML5 Video -->
                		<li class="panel5">
                			<video width="320" height="240" controls="controls">
                				<source src="video/movie.ogg" type="video/ogg">
                				<source src="video/movie.mp4" type="video/mp4">
                				<source src="video/movie.webm" type="video/webm">
                				Your browser does not support the video tag. But you could include an iframe/embeded video here.
                			</video>
                		</li>
                        <!-- Vimeo: Embeded -->
                        <li class="panel2"><object width="940" height="529"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=12280336&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=12280336&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=00adef&amp;fullscreen=1&amp;autoplay=0&amp;loop=0" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="940" height="529"></embed></object></li>
                    </ul>
                </div>    
            </div>	
        </div><!-- end of .mainContent-->
		 <div class="footer">
            <div class="footer_line"></div>
            <div class="footer_info">
        		<div class="info">
            		<h2>Le Fruit de Hasard</h2>
                	<p>
                        12 rue Labour<br />
                        75015 Paris<br />
                        Tel:+33 (0)1 56 08 50 78<br />
                        Fax:+33 (0)1 56 08 50 78<br />
                        Contact:JEMERO BOURGEOISAT<br />
                        Mob:+33 (0)6 80 98 68 10<br />
                    </p>
                    <p><a href="#"><img src="images/footer_img/icon_footer.png" alt="images" /></a>
                    <span>Jerome Bourgeoiat _jeebourgeoiat</span></p>
            	</div><!-- end of .info-->
            	<div class="info">
                    <p><img src="images/footer_img/logo_title.png" alt="images"/></p>
                    <p>Inscrivez-vous<br />
                        /desinscrivez-vous<br />
                        a la newslette
                    </p>
                    <p><a href="#"><img src="images/footer_img/logo_fb.png" alt="images" /></a>
                    <span>j'aime</span></p>
                </div><!-- end of .info-->
                <div class="info">
                	<p>Le Fruit de Hasard est membre
                     du Grand Bureau,<br />
                     plateforme cooperative d'experts<br />
                     de la communication<br />
                     www.legrandbureau.com 
                    </p>
                </div><!-- end of .info-->
             </div><!-- end of .footer_info-->
            <div class="footer_copyright">
                <p>&copy;2012_Plan do site_Mention Legate</p>
            </div><!-- end of .footer_copyright-->
        </div><!-- end of .footer-->
    </div><!-- end of .wrapper-->
   
</body>
</html>
